<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
	<style type="text/css">
.default {
	padding: 5px;
	text-align: left;
	font-family: Arial, Verdana, sans-serif;
	border: 1px solid #000;
	border-bottom: 1;
}

.buttons {
	padding: 5px;
	text-align: left;
	font-family: Arial, Verdana, sans-serif;
	margin-top: 0;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0;
}

.table-header {
	text-align: center;
	background: none repeat scroll 0 0 #E5E5E5;
	border-bottom: 1px solid #BBBBBB;
	padding: 16px;
}

.table-odd-row {
	text-align: center;
	background: none repeat scroll 0 0 #FFFFFFF;
	border-top: 1px solid #BBBBBB;
}

.table-even-row {
	text-align: center;
	background: none repeat scroll 0 0 #E5E5E5;
	border-top: 1px solid #BBBBBB;
}
</style>
</h:head>
<h:body>
	<h2>JSF 2 example on JBoss 7</h2>
	<h:form id="jsfexample">
		<h:panelGrid columns="2" styleClass="default">

			<h:outputText value="Enter key:" />
			<h:inputText value="#{property.key}" />

			<h:outputText value="Enter value:" />
			<h:inputText value="#{property.value}" />

			<h:commandButton actionListener="#{manager.save}"
				styleClass="buttons" value="Save key/value" />
		

			<h:messages />


		</h:panelGrid>


		<h:dataTable value="#{propertyList}" var="item"
			styleClass="table" headerClass="table-header"
			rowClasses="table-odd-row,table-even-row">
			<h:column>
				<f:facet name="header">Key</f:facet>
				<h:outputText value="#{item.key}" />
			</h:column>
			<h:column>
				<f:facet name="header">Value</f:facet>
				<h:outputText value="#{item.value}" />
			</h:column>
			<h:column>
				<f:facet name="header">Delete</f:facet>
				<h:commandButton actionListener="#{manager.clear(item)}"
				styleClass="buttons" value="Delete" />
			</h:column>

		</h:dataTable>
	</h:form>
</h:body>
</html>
